$(function () {
    let account = $('#account');
    let psw = $('#password');
    let btn = $('.mi-form-button');
    let accText = $('.account-text');
    let pswText = $('.password-text');
    let pswBtn = $('.mi-form-psw>button');
    let checkBtn = $('.mi-form-terms>input');


    if (account.val() !== "" && psw.val() !== "") {
        btn.css('opacity', '1');
    }

    account.on('input', function () {
        if (account.val() !== "") {
            account.css({
                'background': '#f9f9f9',
                'bordercolor': '#f9f9f9'
            })
            accText.prev().css('color', '#ddd')
            accText.css('display', 'none')
            if (psw.val() !== "") {
                btn.css('opacity', '1');
                btn.css('pointer-events', 'auto')
            } else {
                btn.css('opacity', '.4');
                btn.css('pointer-events', 'none')
            }
        } else {
            accText.css('display', 'block')
            accText.prev().css('color', 'red')
            account.css({
                'background': '#fbf2f3',
                'bordercolor': '#fbf2f3'
            })
        }
    })

    psw.on('input', function () {
        if (psw.val() !== "") {
            psw.css({
                'background': '#f9f9f9',
                'bordercolor': '#f9f9f9'
            })
            pswText.prev().prev().css('color', '#ddd')
            pswText.prev().css('background', '#f9f9f9')
            pswText.css('display', 'none')
            if (account.val() !== "") {
                btn.css('opacity', '1');
                btn.css('pointer-events', 'auto')
            } else {
                btn.css('opacity', '.4');
                btn.css('pointer-events', 'none')
            }
        } else {
            pswText.css('display', 'block')
            pswText.text('请输入密码')
            pswText.prev().prev().css('color', 'red')
            pswText.prev().css('background', '#fbf2f3')
            psw.css({
                'background': '#fbf2f3',
                'bordercolor': '#fbf2f3'
            })
        }
    })

    pswBtn.on('click', function (ev) {
        ev.preventDefault();
        $(this).toggleClass('icon-zhengyan')
        if ($(this).attr('class').indexOf('icon-zhengyan') !== -1) {
            psw.attr('type', 'text');
        } else {
            psw.attr('type', 'password');
        }
    })




    btn.on('click', function () {
        $.ajax({
            type: "get",
            url: "../interface/login.php",
            data: {
                account: account.val()
            },
            dataType: "json"
        }).then(res => {

            if (account.val() !== "" && psw.val() !== "") {
                if (checkBtn[0].checked) {
                    if (res === null) {
                        pswText.text('用户或密码不正确')
                        pswText.css('display', 'block')
                    } else {
                        if (account.val() === res.account && psw.val() === res.password) {
                            alert('登录成功');
                            cookie.set('account', res.account);
                            setTimeout(() => {
                                self.location = './index.html';
                            }, 1000);
                        } else {
                            pswText.text('用户或密码不正确')
                            pswText.css('display', 'block')
                        }
                    }
                } else {
                    alert('请你同意用户条款')
                }
            }

        }).catch(xhr => {
            console.log(xhr.status)
        })
    });

});